<!-- 第二步 -->

<template>
  <div class="RepairList-Step2">
    <FormSelect v-show="false" v-bind="sourceProp" />

    <EasyRow col2>
      <FormSelect v-bind="typeProps" />
      <FormSelect v-bind="subTypeProps" word2 @change="changeType" />
    </EasyRow>

    <FormInput label="所在位置" bind="areaName" :max="50" required />

    <EasyRow col2>
      <FormSlot :label="`关联${CORE.MAP.ASSET}`">
        <MyDevice />
      </FormSlot>
      <FormRadio label="加急" bind="hastenStatus" :dict="HURRY_STATUS" />
    </EasyRow>

    <FormTextarea label="工单描述" bind="description" :max="500" :rows="8" required />

    <FormImage label="图片" bind="image" folder="repair" :limit="3" />
  </div>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import MyModal from '@admin/views/Maintain/Repair/RepairTemplate/MyModal'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'Step2',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixWeb('add')],

  /**
   * 组件导入 (Abc.vue + Abc/index.vue)
   */
  ...CORE.components(require.context('./', true, /vue$/)),

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    ...MyModal.computed,

    /**
     * 加急状态
     */
    HURRY_STATUS() {
      return [
        [2, '是'],
        [1, '否'],
      ]
    },

    /**
     * 来源属性
     */
    sourceProp() {
      return {
        bind: 'orderSourceCode, orderSourceName, orderSourceId',
        dict: CORE.DICT.task_source.map(([id, name, code, ...other]) => [code, name, id, ...other]),
      }
    },
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 切换类型
     */
    changeType([typeId]) {
      const { one, $root: { repair_assign_selectDict: assign } } = this
      const [, organId, uaaUserId, name, phone] = assign.find(item => item[0] === typeId) || []

      CORE.merge(one, {
        resolverUserId: uaaUserId,
        resolverUserName: name,
        resolverUserPhone: phone,
        user: { uaaUserId, name, phone, organId: [organId] }, // 指派人
      })
    },
  },
}
</script>

<style lang="scss">
@import './index.scss';
</style>
